

  <title>菜单管理</title>

  <div class="layui-card layadmin-header">
    <div class="layui-breadcrumb" lay-filter="breadcrumb">
      <a lay-href="">主页</a>
      <a><cite>权限中心</cite></a>
      <a><cite>菜单管理</cite></a>
    </div>
  </div>
	
  <div class="layui-fluid">
    <div class="layui-row layui-col-space15">
      <div class="layui-col-md12">
        <div class="layui-card">
          <div class="layui-card-header">菜单管理</div>
          <div class="layui-card-body">
            <div class="layui-btn-container">
              <button type="button" class="layui-btn layui-btn-sm" lay-demo="insert1">添加上级菜单</button>
              <button type="button" class="layui-btn layui-btn-sm" lay-demo="insert2">添加下级菜单</button>
           </div>
            <div id="test-tree-demo1"></div>
          </div>
        </div>
        <!-- <div class="layui-card">
          <div class="layui-card-header">常规用法</div>
          <div class="layui-card-body">
            <div id="test-tree-demo2"></div>
          </div>
        </div>
        <div class="layui-card">
          <div class="layui-card-header">无连接线风格</div>
          <div class="layui-card-body">
            <div id="test-tree-demo3"></div>
          </div>
        </div>
        <div class="layui-card">
          <div class="layui-card-header">仅节点左侧图标控制收缩</div>
          <div class="layui-card-body">
            <div id="test-tree-demo4"></div>
          </div>
        </div>
        <div class="layui-card">
          <div class="layui-card-header">手风琴模式</div>
          <div class="layui-card-body">
            <div id="test-tree-demo5"></div>
          </div>
        </div>
        <div class="layui-card">
          <div class="layui-card-header">点击节点新窗口跳转</div>
          <div class="layui-card-body">
            <div id="test-tree-demo6"></div>
          </div>
        </div>
        <div class="layui-card">
          <div class="layui-card-header">开启复选框</div>
          <div class="layui-card-body">
            <div id="test-tree-demo7"></div>
          </div>
        </div> -->
        <!-- <div class="layui-card">
          <div class="layui-card-header">开启节点操作图标</div>
          <div class="layui-card-body">
            <div id="test-tree-demo1"></div>
          </div>
        </div> -->
      </div>
    </div>
  </div>

	<div class="site-text" style="margin: 5%; display: none" id="window"  target="test123">
		<form class="layui-form" method="post" >
		  <input type = "hidden"  id="menuId" name="menuId" lay-verify="menuId" autocomplete="off" placeholder="" class="layui-input">
		  <div class="layui-form-item">
		    <label class="layui-form-label">菜单名称</label>
		    <div class="layui-input-block">
		      <input type="text" id="menuNm" name="menuNm" lay-verify="menuNm" autocomplete="off" placeholder="请输入菜单名称" class="layui-input">
		    </div>
		  </div>
		  <div class="layui-form-item">
		    <label class="layui-form-label">菜单链接</label>
		    <div class="layui-input-block">
		      <input type="text" id="menuURL" name="menuURL" lay-verify="menuURL" autocomplete="off" placeholder="请输入菜单链接" class="layui-input">
		    </div>
		  </div>
		  
		  <div class="layui-form-item">
		    <label class="layui-form-label">菜单描述</label>
		    <div class="layui-input-block">
		      <input type="text" id="menuDesc" name="menuDesc" lay-verify="menuDesc" autocomplete="off" placeholder="请输入菜单描述" class="layui-input">
		  </div>
		  </div>
		  
		 
		  <div class="layui-form-item">
		    <div class="layui-input-block">
		      <button class="layui-btn" lay-submit="" lay-filter="demo1">提交修改</button>
			  
			  <button class="layui-btn" lay-submit="" lay-filter="del" >删除菜单</button>
		    </div>
		  </div>
		</form>
	</div>
	
	<div class="site-text" style="margin: 5%; display: none" id="window1"  target="test1">
		<form class="layui-form" method="post" >
		  <input type = "hidden"  id="menuId1" name="menuId1" lay-verify="menuId1" autocomplete="off" placeholder="" class="layui-input">
		  <div class="layui-form-item">
		    <label class="layui-form-label">菜单名称</label>
		    <div class="layui-input-block">
		      <input type="text" id="menuNm1" name="menuNm1" lay-verify="menuNm1" autocomplete="off" placeholder="请输入菜单名称" class="layui-input">
		    </div>
		  </div>
		  <div class="layui-form-item">
		    <label class="layui-form-label">菜单链接</label>
		    <div class="layui-input-block">
		      <input type="text" id="menuURL1" name="menuURL1" lay-verify="menuURL1" autocomplete="off" placeholder="请输入菜单链接" class="layui-input">
		    </div>
		  </div>
		  
		  <div class="layui-form-item">
		    <label class="layui-form-label">菜单描述</label>
		    <div class="layui-input-block">
		      <input type="text" id="menuDesc1" name="menuDesc1" lay-verify="menuDesc1" autocomplete="off" placeholder="请输入菜单描述" class="layui-input">
			</div>
		  </div>
		  
		 
		  <div class="layui-form-item">
		    <div class="layui-input-block">
		      <button class="layui-btn" lay-submit="" lay-filter="demo2">立即提交</button>
			  
		    </div>
		  </div>
		</form>
	</div>
	
	<div class="site-text" style="margin: 5%; display: none" id="window2"  target="test1">
		<form class="layui-form" method="post" >
		  <input type = "hidden"  id="menuId2" name="menuId2" lay-verify="menuId2" autocomplete="off" placeholder="" class="layui-input">
		  <div class="layui-form-item">
		    <label class="layui-form-label">菜单名称</label>
		    <div class="layui-input-block">
		      <input type="text" id="menuNm2" name="menuNm2" lay-verify="menuNm2" autocomplete="off" placeholder="请输入菜单名称" class="layui-input">
		    </div>
		  </div>
		  <div class="layui-form-item">
		    <label class="layui-form-label">菜单链接</label>
		    <div class="layui-input-block">
		      <input type="text" id="menuURL2" name="menuURL2" lay-verify="menuURL2" autocomplete="off" placeholder="请输入菜单链接" class="layui-input">
		    </div>
		  </div>
		  
		  <div class="layui-form-item">
		    <label class="layui-form-label">菜单描述</label>
		    <div class="layui-input-block">
		      <input type="text" id="menuDesc2" name="menuDesc2" lay-verify="menuDesc2" autocomplete="off" placeholder="请输入菜单描述" class="layui-input">
			</div>
		  </div>
		  <div class="layui-form-item">
		    <label class="layui-form-label">上级菜单名称</label>
		    <div class="layui-input-block">
		      <select name="superMenu" lay-verify="required" lay-search="" lay-reqtext="请选择所在院校" id="superMenu">
			  </select>
			</div>
		  </div>
		  <div class="layui-form-item">
		    <div class="layui-input-block">
		      <button class="layui-btn" lay-submit="" lay-filter="demo3">立即提交</button>
			  
		    </div>
		  </div>
		</form>
	</div>


  <script>
	  
	function data(){
		var result =[];
		$.get({
		  url: path + '/authority/Menu/selectMenuTree',
		  async:false,
		  success:function(res){
			  if(res.code == 0){
				  result = res.data;
			  }
		  }
		})
		return result;
	}
	
  layui.use(['admin', 'tree', 'util'], function(){
	 
	
	
	    
    var tree = layui.tree
    ,layer = layui.layer
    ,util = layui.util
    
	// table.render({
	// 	var TableTree = function () {this.config = {},this.aopObj = {}};
	// 	TableTree.prototype = {
	// 		reload:function (options) {
	// 			this.config.url = this.url;
	// 			delete this.config.data;
	// 			this.render(options);
	// 		}
	// 	}
	// });
	 
 //    treeTable.reload();
    // //基本演示
    // tree.render({
    //   elem: '#test-tree-demo1'
    //   ,data: result
    //   ,showCheckbox: true  //是否显示复选框
    //   ,id: 'test-tree-demoId1'
    //   ,isJump: true //是否允许点击节点时弹出新窗口跳转
    //   ,click: function(obj){
    //     var data = obj.data;  //获取当前点击的节点数据
    //     layer.msg('状态：'+ obj.state + '<br>节点数据：' + JSON.stringify(data));
    //   }
    // });
    
    //按钮事件
    util.event('lay-demo', {
      insert1: function(){
        layer.open({
			title: '新增上级菜单'
			,area: ['600px', '300px']
			,skin: 'layui-layer-molv'
			,shadeClose: true
			,type:1
			,shade: 0 //遮罩透明度
			,content: $("#window1")
		})
      }
      ,insert2: function(){
        layer.open({
        	title: '新增下级菜单'
        	,area: ['600px', '300px']
        	,skin: 'layui-layer-molv'
        	,shadeClose: true
        	,type:1
        	,shade: 0 //遮罩透明度
        	,content: $("#window2")
			,done:addoption()
        })
      }
    });
   
    //开启节点操作图标
    tree.render({
		
      elem: '#test-tree-demo1'
	  ,onlyIconControl: true  //是否仅允许节点左侧图标控制展开收缩
      ,data: eval(data())
      ,click: function(obj){
		showMenu(obj);
        layer.open({
			title: '修改菜单'
			,area: ['600px', '300px']
			,skin: 'layui-layer-molv'
			,shadeClose: true
			,type:1
			,shade: 0 //遮罩透明度
			,content: $("#window")
			
		})
      },
    });
	
	function addoption(){
		
		
		$.get({
			url : path + '/authority/Menu/selectAllSuperMenu',
			// headers: { //通过 request 头传递
			//     access_token: layui.data('layuiAdminTest').access_token
			// },
			success:function(res){
				if(res.code == 0){
					var content = "<option value =''"+">请选择上级菜单</option>"
					for(var i=0;i<res.data.length;i++){
						var superMenu = res.data[i];
						content += "<option value='"+superMenu.menuId+"'>"+superMenu.menuNm+"</option>"
						
					}
					
					$("#superMenu").html(content);
					layui.form.render("select"); 
				}
			}
		})
	}
	
	function showMenu(obj){
		$.get({
			url:path + "/authority/Menu/selectMenuByMenuId",
			data : {
				menuId:obj.data.id
			},
			success:function(res){
				if(res.code == 0){
					var mMenu = res.data
					$("#menuId").val(mMenu.menuId),
					$("#menuNm").val(mMenu.menuNm),
					$("#menuURL").val(mMenu.menuUrl),
					$("#menuDesc").val(mMenu.menuDesc)
				}
			}
		})
	}
	// function delMenu(){
	// 	$.post({
	// 		url:path + "/authority/Menu/delMenu",
	// 		data:{
	// 			menu:$("#menuID").val(),
	// 			_method:'delete'
	// 		},
			
	// 		success:function(res){
	// 			if(res.code == 0){
	// 				lay.msg(data.msg);
	// 				window.location.reload();
	// 			}else if (data.code ==1002){
	// 				lay.msg(data.msg);
	// 			}
	// 		}
	// 	})
	// 	return false;
	// }
	layui.use(['form', 'layedit', 'laydate'], function(){
	           var form = layui.form
	               ,layer = layui.layer
	               ,layedit = layui.layedit
	               ,laydate = layui.laydate;
		
	           form.render();
	           //创建一个编辑器
	           var editIndex = layedit.build('LAY_demo_editor');
		
	           form.verify({
	           	menuNm: function(value){
	           		if(value.length < 2){
	           			return '菜单名至少得2个字符';
	           		}
	           	}
				,menuURL:function(value){
					if(value.length < 1){
						return '菜单地址不能为空';
					}
	           	}
	           	,menuDesc:function(value){
					if(value.length < 6){
						return '描述至少得6个字符';
					}
	           	}
	           	
	           });
		
	           //监听表单提交
	           form.on('submit(demo1)', function(data){
	                   $.post({
						   url : path + "/authority/Menu/updateMenu",
						   data : {
						   		menuId:$("#menuId").val(),
						   		menuNm:$("#menuNm").val(),
						   		menuUrl:$("#menuURL").val(),
						   		menuDesc:$("#menuDesc").val(),
						   		menuState:1,
								_method: 'put'
						   },
						   success:function (res){
							   if(res.code == 0){      
							       //    layer.msg(data.msg);
							       //layer.closeAll();       //关闭确认提交的弹出
							       
									window.location.reload();
							   		
							   }else if(data.code == 1002){
							       layer.msg(res.Msg);
							   }
						   }
	                       
	                   })
						return false;
	               });
				form.on('submit(del)',function(data){
					$.post({
						url:path + "/authority/Menu/delMenu",
						data:{
							menuId:$("#menuId").val(),
						},
						
						success:function(res){
							if(res.code == 0){
								layer.msg(res.Msg);
								window.location.reload();
							}else if (data.code ==1002){
								layer.msg(res.Msg);
							}
						}
					})
					return false;
				})
	              
	          
		
	           //表单取值
	           layui.$('#LAY-component-form-getval').on('click', function(){
	               var data = form.val('example');
	               alert(JSON.stringify(data));
	           });
		
	       });
		   

		
		
		
		layui.use(['form', 'layedit', 'laydate'], function(){
		       var form = layui.form
			   ,layer = layui.layer
			   ,layedit = layui.layedit
			   ,laydate = layui.laydate;
		
		       form.render();
				
		       
		
		       //监听表单提交
		       form.on('submit(demo2)', function(data){
				   
				   /*发送新增角色请求*/
				   
				   $.get({
					   
					   url : path + "/authority/Menu/insertSuperMenu",
					   data : {
					   						
							menuNm: $("#menuNm1").val(),
							menuDesc: $("#menuDesc1").val(),
							menuUrl: $("#menuURL1").val(),
							addUserId : 1
					   },
					   success:function(res){
						   if(res.code == 0){      //修改成功跳转到 院校信息页面
								layer.msg(res.Msg);
							    layer.closeAll();       //关闭确认提交的弹出
								window.location.reload();
			
						   }else if(data.code == 1002){
								   layer.msg(res.Msg);
						   }
					   }
					   
				   })
				   return false;
					
			   });
		
		          
		      
		
		       //表单取值
		       layui.$('#LAY-component-form-getval').on('click', function(){
		           var data = form.val('example');
		           alert(JSON.stringify(data));
		       });
		
		});	
		
		
		
		
		
		
		
		
		
		
		layui.use(['form', 'layedit', 'laydate'], function(){
		       var form = layui.form
			   ,layer = layui.layer
			   ,layedit = layui.layedit
			   ,laydate = layui.laydate;
		
		       form.render();
				
		       
		
		       //监听表单提交
		       form.on('submit(demo3)', function(data){
				   
				   /*发送新增角色请求*/
				   
				   $.get({
					   
					   url : path + "/authority/Menu/insertChildMenu",
					   data : {
					   						
							menuNm: $("#menuNm2").val(),
							menuDesc: $("#menuDesc2").val(),
							menuUrl: $("#menuURL2").val(),
							superMenuId: $("#superMenu").val(),
							addUserId : 1
					   },
					   success:function(res){
						   if(res.code == 0){      //修改成功跳转到 院校信息页面
								layer.msg(res.Msg);
							    layer.closeAll();       //关闭确认提交的弹出
								window.location.reload();
			
						   }else if(data.code == 1002){
								   layer.msg(res.Msg);
						   }
					   }
					   
				   })
				   return false;
					
			   });
		
		          
		      
		
		       //表单取值
		       layui.$('#LAY-component-form-getval').on('click', function(){
		           var data = form.val('example');
		           alert(JSON.stringify(data));
		       });
		
		});	
		
	
  });
  </script>